<template>
  <div>
<h1>理财项目列表页面</h1>
理财项目名称:<input type="text" v-model="state.CName">
理财总金额:<input type="text" v-model="state.Min">-<input type="text" v-model="state.Max">
<input type="button" value="查询" @click="show"/>
<table class="table table-bordered">
  <tr>
    <td>理财id</td>
    <td>理财项目名称</td>
    <td>理财总金额</td>
    <td>年收益</td>
    <td>风险等级</td>
    <td>理财金额</td>
    <td>操作</td>
  </tr>
  <tr v-for="item in list">
    <td>{{item.Cid}}</td>
    <td>{{item.CName}}</td>
    <td>{{item.CZongE}}</td>
    <td>{{item.CShouYi}}</td>
    <td>{{item.CFengXian}}</td>
    <td>{{item.CJinE}}</td>
    <td><input type="button" value="我要赎回" @click="tiao(item.Cid)"/></td>
  </tr>
</table>
  </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import axios from 'axios';
import { useRoute, useRouter } from 'vue-router';
const router = useRouter();
const route = useRoute();

let data:any=reactive({
  state:{
    CName:'',
    Max:'',
    Min:''
  },
list:[]
})

let {state,list}=toRefs(data)

const tiao=(Cid:any)=>{
router.push({
  path:'/shuhui',
  query:{
    Cid:Cid
  }
})
}

onMounted(()=>{
  show()
})

const show=()=>{
axios({
  url:'/api/Users/GetShow',
  method:'get',
  params:state.value
})
.then(res=>{
  console.log(res.data);
  list.value=res.data.data;
  console.log(res.data.data.length);
})
.catch(err=>{
  console.log(err);
  
})
}
</script>

<style scoped>

</style>